/*
 * @Date: 2023-08-03 09:43:40
 * @LastEditors: zhangsongwei
 * @LastEditTime: 2023-08-06 02:48:11
 * @FilePath: /z/src/pages/dashbord/auth.tsx
 * @description:
 */
import React, { useEffect, useState } from "react";

import { Table, Select, Row, Col, Button } from "antd";

import { getMenuList, getUserList, addUserPermission } from "../../urls/p";
const { Option } = Select;

export default () => {
  const [dataList, setDataList] = useState([]);
  const [userList, setUserList] = useState([]);
  const [menu, setMenu] = useState("");
  const [selUser, setSelectUser] = useState([]);
  useEffect(() => {
    getData();
    getUser();
  }, []);

  const getData = async () => {
    const res = await getMenuList("");
    const { info = [] } = res;
    if (info.length) {
      setDataList(info);
    }
  };
  const getUser = async () => {
    const res = await getUserList();
    const { info = [] } = res;
    if (info.length) {
      setUserList(info);
    }
  };

  return (
    <div>
      <Row gutter={[20, 0]}>
        <Col span={12}>
          <h1>select menu to add user permission</h1>
          <Select style={{ width: "100%" }} onChange={setMenu}>
            {dataList.map((d: any) => {
              return <Option value={d.menuCode}>{d.menuName}</Option>;
            })}
          </Select>
        </Col>
        {menu ? (
          <Col span={12}>
            <h1>select user </h1>
            <Select
              mode="multiple"
              style={{ width: "100%" }}
              placeholder="Please select"
              onChange={setSelectUser}
            >
              {userList.map((d: any) => {
                return <Option value={d.username}>{d.username}</Option>;
              })}
            </Select>
            ,
          </Col>
        ) : (
          <></>
        )}
      </Row>
      <Row>
        {selUser.length ? (
          <Button
            onClick={async () => {
              const res = await addUserPermission({
                menuCode: menu,
                userList: selUser,
              });
              setMenu("");
              setSelectUser([]);
              getData();
              getUser();
            }}
          >
            Add
          </Button>
        ) : (
          <></>
        )}
      </Row>
    </div>
  );
};
